import React, { PropTypes } from 'react'
import { connect } from 'react-redux'
import { Menu, Icon } from 'antd'
import { Link } from 'react-router'
import './index.less'
const defaultProps = {
    items: [],
    currentIndex: 0
};

const propTypes = {
    items: PropTypes.array,
    currentIndex: PropTypes.number
};

class Sidebar extends React.Component {
    constructor(props) {
        super(props)
        this.state = {
            open:false
        }
    }

    onClickMenuHasSub(){
        this.setState({
            open:!this.state.open
        });
    }
    render(){
        return (
            <div className=" menu">
                <h2>
                    <span>用户中心</span>
                </h2>
                <hr className="line-mod"/>
                <dl className="menu-list">
                    <dd>
                        <a href="javascript:void(0);" className="menu-lv2 act">
                            <span>帐户信息</span>
                        </a>
                    </dd>
                    <dd>
                        <a href="javascript:void(0);" className="menu-lv2">
                            <span>项目管理</span>
                        </a>
                    </dd>
                    <dd className={ this.state.open ? " act" : "" } onClick={::this.onClickMenuHasSub}>
                        <a href="javascript:void(0);" className="menu-lv2" >
                            <span>费用中心</span>
                            <i className="white-down-icon"></i>
                        </a>
                        <ul className="menu-sub">
                            <li>
                                <a href="javascript:void(0);" className="menu-lv3 act">
                                    <i className="ico-dot" />
                                    <span>收支明细</span>
                                </a>
                                <a href="javascript:void(0);" className="menu-lv3">
                                    <i className="ico-dot" />
                                    <span>收支明细</span>
                                </a>
                            </li>
                        </ul>
                    </dd>
                </dl>
            </div>
        )
    }
}

Sidebar.propTypes = propTypes;
Sidebar.defaultProps = defaultProps;

export default Sidebar;
